<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE composition PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns:ui="http://java.sun.com/jsf/facelets"
                template="./../template/userTemplate.xhtml"
                xmlns:h="http://java.sun.com/jsf/html"
                xmlns:f="http://java.sun.com/jsf/core">

    <ui:define name="title">
        title
    </ui:define>

    <ui:define name="head">
        head
    </ui:define>

    <ui:define name="content1">
        <div class="page-header">
            <h3>Login</h3>
          

        </div>
        <div class="col-3 col-sm-3 col-lg-3"></div>
        <div class="col-6 col-sm-6 col-lg-6 alert alert-info">
            <h:form>
                <div class="form-group">

                    <div class="input-group ">
                        <span class="input-group-addon">Username</span>
                        <h:inputText styleClass= "form-control" value="#{login.username}" />
                    </div>
                </div>
                <div class="form-group">
                    <div class="input-group ">
                        <span class="input-group-addon">Password</span>
                        <h:inputSecret value="#{login.password}"  onfocus="" styleClass="form-control" />
                    </div>
                </div>
                <div class="form-group">
                    <div class="input-group ">
                        <span class="input-group-addon">Role</span>
                        <h:selectOneMenu value="#{login.role}" class="form-control" >
                            <f:selectItems value="#{login.allRole}" var="r" itemLabel="#{r.roleName}" itemValue="#{r}"  />
                        </h:selectOneMenu>
                    </div>
                </div>
                <div class="form-group">
                    <div class="checkbox">
                        <label>
                            <h:selectBooleanCheckbox value="#{login.isRemember}" styleClass="checkbox-size" id="login-check" /><label for="login-check">Remember me</label>
                        </label>
                    </div>
                </div>
                <div class="form-group">
                    <div class="">
                        <!--                            <button type="button" class="btn btn-default">Login</button>-->
                        <h:commandButton action="#{login.dologin()}"  value="Login" styleClass="btn btn-default" />
                        <!--                            <button type="button" class="btn btn-default">Forgot password?</button>-->
                        <h:commandButton action="#{login.forgot()}" value="Fotgot password?" styleClass="btn btn-default" />
                    </div>
                </div>
            </h:form>
            <h:panelGroup id="msg_error" layout="block" rendered="#{login.isError}" styleClass="alert alert-danger">
                #{login.msg_error}
            </h:panelGroup>
            <!--                <div class="alert alert-danger" >
                                Sorry! Your username/email and password doesnt match any account
                            </div>-->

        </div>
<!--        <div class="row">
              <ol class="breadcrumb">
                <li><a href="#">Home</a></li>
                <li><a href="#">Library</a></li>
                <li class="active">Data</li>
            </ol>
        </div>-->
    </ui:define>

</ui:composition>
